.top_imgbar{
    margin: 80px 0px 50px 0px;
}
.top_imgbar img {
    width: 100%
}
.excellence_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.excellence_list li{
    float: left;
    padding: 0 15px;
    width: 25%;
    margin-bottom: 35px;
}
.excellence_list li img{
    width: 278px;
    height: 189px;
    transition: transform 0.5s;
}
.excellence_list .esi{
    position: absolute;
    bottom: 10px;
    right: 12px;
    color: #999;
}
.excellence_list .world{
    position: absolute;
    left: 50%;
    top: 65px;
    margin-left: -126px;
}
.excellence_list .view-hover{
    position: relative;
    height: 189px;
    overflow: hidden;
    cursor: pointer;
}
.excellence_list .view-hover:hover img {
    transform: scale(1.2);
}
.excellence_list .view-hover:hover .mask {
    position: absolute;
    width: 100%;
    line-height: 170px;
    height: 190px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
    top: 0px;
    left: 0;
    opacity: 0.8;
    transition: 0.5s;
}
.excellence_list .view-hover:hover i{
    display: inline-block;
}
.excellence_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    line-height: 170px;
    height: 189px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.8;
    transition: 0.5s;
}
.excellence_list .mask {
    position: absolute;
    width: 100%;
    line-height: 40px;
    height: 40px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
    top: 0px;
    left: 0;
    opacity: 0.8;
    transition: 0.5s;
}
.excellence_list .mask i{
    display: none;
    font-size: 16px;
    padding-left: 6px;
    transition: 0.5s;
}
.excellence_list .maskdown i{
    display: none;
    font-size: 16px;
    padding-left: 6px;
    transition: 0.5s;   
}
.excellence_list .maskdown {
    position: absolute;
    width: 100%;
    line-height: 40px;
    height: 40px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.8;
    transition: 0.5s;
}
.admissionBtn{
    text-align: center;
    margin-top: 50px;
    margin-bottom: 70px;
}
.shu_modal{
    background-image: url(../images/shu.jpg), none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 290px;
}
.shu_modal{
    position: relative;
}
.shu_modal ul li{
    float: left;
    text-align: center;
    padding: 0 15px;
    width: 33.33%;
}
.shu_modal ul li a{
    position: relative;
    display: inline-block;
    padding: 10px 50px;
    background-color: #1b467b;
    border-radius: 5px;
    bottom: -270px;
    color: #fff;
}
.admissionBtn a {
    display: inline-block;
    padding: 20px 98px;
    background-color: #1b467b;
    border-radius: 5px;
    font-size: 14px;
    transition: 0.5s;
    color: #fff;
}
.admissionBtn a:hover{
    font-size: 16px;
}
.messagelist ul{
    position: relative;
    margin: 0;
    overflow: hidden;
    list-style: none;
}
.messagelist ul li {
    float: left;
    text-align: center;
    padding: 0 15px;
    width: 33.33%;
}
.messagelist ul li a {
    display: inline-block;
    padding: 10px 50px;
    background-color: #1b467b;
    border-radius: 5px;
}
.messagelist ul li p{
    line-height: 35px;
    padding: 60px 0px;
}
.aboutshu{
    background-image: url(../images/aboutshubg.png), none;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 1000px;
    margin-bottom: 40px;
}
.aboutshu .tip{
    text-align: center;
    margin-bottom: 50px;
}
.aboutshu .quick_list{
    overflow: hidden;
}
.aboutshu .quick_list ul li {
    float: left;
    width: 400px;
    height: 220px;
    overflow: hidden;
}
.aboutshu .keymess ul li {
    float: left;
    text-align: center;
    width: 33.33%;
    overflow: hidden;
}
.aboutshu .keymess ul li span{
    font-size: 20px;
    color: #499be6;
}
.aboutshu .keymess ul li p{
    padding-top: 10px;
    color: #666;    
}
.aboutshu .key, 
.key2{
    margin-top: 60px;
}
.aboutshu .key, 
.key2 img{
    width: 100%
}
/*.aboutshu img{
    width: 100%
}*/
.colleges{
    background-color: #f2f2f2;
}
.colleges .colltitle{
    text-align: center;
    padding: 40px 0px;
}
.colleges .colltitle p{
    color: #999;
}
.colleges .colltitle span{
    height: 60px;
    display: block;
    text-align: left;
    color: #1b467b;
    font-size: 30px;
}
.colleges .engineering {    
    padding: 60px 100px;
    overflow: hidden;
}
.colleges .engineering img {
    float: left;
}
.colleges .engineering .engineering_list{
    float: right;   
}
.colleges .engineering .engineering_list ul li{
    text-align: left;
    color: #1b467b;
    line-height: 40px;
    list-style: disc;
    font-size: 16px;
}
/*.colleges img{
    width: 100%
}*/
.scholar img {
    width: 100%;
}
.academic{
    background-color: #e2e2e2;
    padding-bottom: 60px;
}
.academic .acatitle{
    text-align: center;
    padding: 40px 0px;
}
.academic .acatitle p{
    color: #999;
}
.scholarship{
    background-color: #fff;
}
.scholarship .shiptitle{
    text-align: center;
    padding: 40px 0px;
}
.scholarship .shiptitle p{
    color: #999;   
}
.scholar{
    background-image: url(../images/scholarshipbg.png), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 851px;
}
.scholar .tip{
    padding: 65px 0px;
}
.scholar .tip p{
    font-size: 28px;
    padding-bottom: 18px;
    color: #fff;
    text-align: center;
}
.scholar .scholar_list{
    position: relative;
    overflow: hidden;
    text-align: center;
}
.scholar .scholar_list ul li {
    float: left;
    text-align: center;
    width: 25%;
    overflow: hidden;
    line-height: 25px;
    padding: 0px 20px;
    transition: all 0.3s linear;
}
.scholar .scholar_list ul li:hover{
    transform: translate(0px,-5px);
    /*box-shadow: 0px 0px 5px 0px rgba(0,0,0,.2);*/
    /*border: 1px solid #e3e3e3;*/
    z-index: 100;
    cursor: pointer;
}
.scholar .scholar_list ul li span{
    font-size: 20px;
    color: #499be6;
}
.scholar .scholar_list ul li p{
    padding-top: 10px;
    color: #666;    
}
.learnmore{
    background-image: url(../images/learnmorebg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 260px;
}
.learnmore .moretitle{
    text-align: center;
    color: #fff;
    padding-top: 60px;
}
.learnmore .moretitle p{
    font-size: 28px;
    padding-bottom: 18px;
}
.learnmore .moretitle a{
    display: inline-block;
    padding: 8px 40px;
    border-radius: 20px;
    border: 1px solid #ccc;
    color: #fff;
}
.programs{
    background-color: #fff;
}
.programs .programstitle{
    text-align: center;
    padding: 40px 0px;
}
.programs ul {
    position: relative;
    margin: 0;
    overflow: hidden;
    list-style: none;
}
.programs ul li:first-child{
    float: left;
    text-align: left;
    padding: 0 15px;
    width: 40%;
}
.programs ul li{
    float: right;
    text-align: left;
    padding: 0 15px;
    width: 40%;
}
.programs .tip{
    position: relative;
    color: #499be6;
    border-bottom: 1px solid #dbdbdb;
    font-size: 18px;
    margin: 20px 0px;
    padding: 20px 0px;
}
.programs .tip .line{
    position: absolute;
    border: 2px solid #499be6;
    width: 170px;
    bottom: -2px;
}
.programs ul li .tip_list a{
    color: #9a9a9a;
}
.academic_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    /*overflow: hidden;*/
    list-style: none;
}
.academic_list li{
    position: relative;
    float: left;
    /*margin: 20px 20px 20p;*/
    padding: 0 15px;
    width: 33.33%;
}
.academic_list li img{
    width: 384px;
    height: 222px;
    transition: transform 0.5s;
}
.academic_list .esi{
    position: absolute;
    bottom: 10px;
    right: 12px;
    color: #999;
}
.academic_list .mask {
    position: relative;
    width: 100%;
    line-height: 40px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
    transform: translateY(100%);
    top: -80px;
    bottom: 0;
    opacity: 0.8;
    left: 0;
    transition: transform 0.4s, opacity 0.1s;

}
.academic_list .telecomPopup{
    position: absolute;
    top: -35px;
    width: 540px;
    height: 300px;
    background: #5d9dd6;
    z-index: 99;
    opacity: 0;
    left: -80px;
    color: #fff;
    padding: 20px;
    transition: all 0.5s;
}
.academic_list .view-hover:hover .telecomPopup{
    opacity: 0.8;
    cursor: pointer;
    /*width: 540px;*/
    /*height: 300px;*/
}
.academic_list .view-hover:hover img {
    transform: scale(1.1);
}
.academic_list .telecomPopup .title{
    text-align: center;
}
.academic_list .telecomPopup  span{
    color: #000;
    margin-top: 25px;
    display: block;
}
.academic_list .maskdown {
    position: relative;
    width: 100%;
    line-height: 40px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
     /*opacity: 0; */
    transform: translateY(100%);
    top: -80px;
    bottom: 0;
    left: 0;
    transition: transform 0.4s, opacity 0.1s;
}
.xfview-hover:hover .maskitem{
    opacity: 1;
    transition: 1s;
}
.research_list .maskitem{
    position: absolute;
    width: 216px;
    height: 0px;
    /*padding: 10px;*/
    top: 0px;
    z-index: 99;
    opacity: 0;
    transition: 1s;
}
.research_list .maskitem{
    /*background: #f9f9f9;*/
    font-size: 12px;
}
.research_list .maskitem p {
    color: #666
}
.research_list .maskitem span {
    color: #000;
}
.research_list .maskitem .itemimg{
    width: 216px;
    height: 164px;
    background-color: #000;
    opacity: 0.6;
    color: #fff;
    text-align: center;
    padding-top: 60px;
    /*line-height: 164px;*/
}
.research_list .maskitem .itemmess{
    padding: 10px;
    background: #f9f9f9;
    font-size: 12px;
}
.research_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    /*overflow: hidden;*/
    list-style: none;
}
.research_list li{
    position: relative;
    float: left;
    /*margin: 20px 20px 20p;*/
    padding: 0 15px;
    width: 20%;
}
.research_list li img{
    width: 226px;
    height: 164px;
}
.research_list .esi{
    position: absolute;
    bottom: 10px;
    right: 12px;
    color: #999;
}
.research_list .mask {
    height: 65px;
    background-color: #fff;
    color: #666;
    padding: 10px;
}
/*.research_list .view-hover:hover .mask{
    height: 100px;
    transition: all 0.5s;
}*/
.research_list .maskdown {
    position: relative;
    width: 100%;
    line-height: 40px;
    background-color: #59adf9;
    color: #fff;
    text-align: center;
     /*opacity: 0; */
    transform: translateY(100%);
    top: -80px;
    bottom: 0;
    left: 0;
    transition: transform 0.4s, opacity 0.1s;
}

/*life@shu*/
.shucieModal{
    padding-top: 130px;
    padding-bottom: 20px;
    background: #f2f2f2;
    overflow: hidden;
}
.shucieModal .shucie .shucieleft{
    width: 740px;
}
.shucieModal .shucie .shucieleft .items{
    height: 120px;
    width: 740px;
    margin-top: 12px;
}
.shucieModal .shucie .shucieleft .item {
    float:left;
}
.shucieModal .shucie .shucieleft .item:first-child{
    padding-right: 10px;
}
.shucieModal .shucie .shucieleft .item img{
    /*position: relative;*/
    /*float: left;*/
}
.shucieModal .shucie .shucieleft .item .mess{
    float: left;
    background: #dce0e6;
    padding: 15px;
    width: 245px;
    height: 120px;
    border-right: 5px solid #c5cdd9;
}
.shucieModal .shucie .title{
    float: left;
    background: #dce0e6;
    width: 390px;
    padding: 20px;
    height: 213px;
    border-left: 5px solid #c5cdd9;
}
.play_icon{
    position: absolute;
    background-image: url(../images/play.png), none;
    background-size: cover;
    width: 40px;
    height: 40px;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
}
.play_bicon{
    position: absolute;
    background-image: url(../images/play.png), none;
    background-size: cover;
    width: 30px;
    height: 30px;
    bottom: 5px;
    right: 5px;
}
.shucieModal .shucie .shucieright{
    width: 440px;
}
.shucieModal .shucie .shucieright ul{
    list-style: none;
    overflow: hidden;
}
.shucieModal .shucie .shucieright ul li {
    height: 100px;
}
.shucieModal .shucie .shucieright .keeplist .mess{
    width: 286px;
    background: #f8fbff;
    height: 100%;
    padding: 30px;
}
.shucieModal .shucie .shucieright .keeplist i{
    width: 100%;
    display: block;
    font-size: 36px;
    color: #fff;
    line-height: 100px;
    text-align: center;
}
.shucieModal .shucie .shucieright .keeplist .right_icon{
    width: 50px;
    height: 100%;
}
.ensure{
    width: 300px;
    height: 58px;
    display: block;
    overflow: hidden;
    line-height: 58px;
    color: #1b467b;
    border: 2px solid #1b467b;
    border-radius: 30px;
    text-align: center;
    margin: 0 auto;
}
.ensure a{
    display: block;
}
.p70{
    padding: 70px 80px 40px 50px;
}
.mr30{    
    margin-left: 30px;
}
.mt22{
    margin-top: 22px;
}
.orange{
    background-color: #f7a623;
}
.red{
    background-color: #ee4d60;
}
.blue{
    background-color: #1b467b;
}
.diversity .itemdown{
    margin-top: 20px;
}
.diversity .maskright{
    position: absolute;
    width: 200px;
    height: 100%;
    padding: 100px 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    right: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.diversity .maskright .tip{
    font-size: 18px;
}
.diversity .maskright span{
    border-bottom: 1px solid #fff;
}
.diversity .view-hoverr:hover .maskright{
    position: absolute;
    width: 588px;
    height: 100%;
    padding: 100px 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    right: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.diversity .maskdown{
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.diversity .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 230px 30px 228px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.diversity .maskdown .tip{
    font-size: 22px;
}
.diversity .maskdown span{
    border-bottom: 1px solid #fff;
}
.artsmodal .artsmess{
    width: 368px;
    padding: 256px 0px;
    overflow: hidden;
}
.artsmodal .artsright{
    width: 832px;
    overflow: hidden;
    padding: 100px 0px;
}
.artsmodal .artsright .maskdown{
    position: absolute;
    width: 100%;
    padding: 95px 30px 95px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 2px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.artsmodal .artsright .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 220px 30px 220px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 2px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.artsmodal .artsright .maskdown .tip{
    font-size: 16px;
}
.artsmodal .artsright .maskdown span{
    border-bottom: 1px solid #fff;
}
.artsmodal .artsright .maskleft{
    position: absolute;
    width: 278px;
    height: 100%;
    padding: 100px 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.artsmodal .artsright .view-hoverl:hover .maskleft{
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 100px 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.artsmodal .artsright .maskleft .tip{
    font-size: 16px;
}
.artsmodal .artsright .maskleft span{
    border-bottom: 1px solid #fff;
}
.artitemleft{
    width: 556px;
}
.sports_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.sports_list li{
    float: left;
    padding: 0 15px;
    width: 33.33%;
    margin-bottom: 80px;
    margin-top: 80px;
}
.sports_list li img{
    width: 385px;
    height: 385px;
    transition: transform 0.5s;
}
.sports_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.sports_list .view-hover:hover img {
    transform: scale(1.2);
}
.sports_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 163px 30px 162px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.sports_list .maskdown {
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.sports_list .maskdown .tip{
    font-size: 22px;
}
.sports_list .maskdown span{
    border-bottom: 1px solid #fff;
}

/*Career-&-Future.html*/
.c1{
    color: #27f2c8;
    font-size: 20px!important;
}
.career{
    position: relative;
    background-image: url(../images/careerbg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 800px;
    margin: 80px 0px 0px 0px;
}
.career .moretitle{
    text-align: center;
    color: #dde0e7;
    padding-top: 180px;
}
.career .moretitle p{
    font-size: 40px;
    padding-bottom: 50px;
}
.career .moretitle a{
    display: inline-block;
    padding: 8px 40px;
    border-radius: 20px;
    border: 1px solid #ccc;
}
.career .moretitle .down{
    position: absolute;
    font-size: 50px;
    bottom: 10px;
    left: 50%;
    margin-left: -22px;
}
.cultivatmodal{

}
.cultivatmodal .cultivatleft{
    width: 550px;
    padding: 110px 30px 50px 0px;
}
.cultivatmodal .cultivatleft .p1{
    font-size: 32px;
    line-height: 45px;
    margin-bottom: 50px;
}
.cultivatmodal .cultivatleft .p2{
    font-size: 16px;
    margin-bottom: 50px;
    line-height: 25px;
    color: #999;
}
.cultivatmodal .cultivatright{
    width: 650px;
    padding: 50px 0px
}
.cultlist{
    width: 335px;
    float: left;
    padding-top: 30px;
}
.cultlist ul li{
    padding: 30px 30px;
    display: inline-block;
}
.cultlist ul li .mess{
    line-height: 22px;
}
.cultlist ul li .tip{
    padding-right: 30px;
}

.labcaremodal{
    padding-bottom: 80px;
    background-color: #f2f2f2;
}
.labcaremodal .shucieleft .pl img{
    width: 675px;
    height: 396px;
}
.labcaremodal .shucieleft .title {
    float: left;
    background: #dce0e6;
    width: 525px;
    padding: 20px;
    height: 396px;
    border-right: 5px solid #c5cdd9;
}
.labcaremodal .shucieleft h2{
    text-align: center;
    padding: 20px 0px;
}
.labcaremodal .shucieleft h2 a{
    color: #333;
}
.labcaremodal .labcaremess{
    position: relative;
    padding: 40px 213px 40px 40px;
    height: 130px;
    width: 100%;
    font-size: 14px;
    overflow: hidden;
    line-height: 20px;
    color: #666;
    background: #fff;
}
.labcaremodal .labcaremess p{
    line-height: 25px;
}
.labcaremodal .labcaremess .labcaricon{
    position: absolute;
    right: 30px;
    top: 30px;
}
.labcaremodal .labcaremess .labcaricon a{
    position: absolute;
    bottom: -10px;
    left: -135px;
}
.more{
    position: absolute;
    color: #46628c !important;
    border-bottom: 1px solid #46628c;
    bottom: 15px;
    right: 15px;
}
.lh25{
    line-height: 25px;
}
.mb30{
    margin-bottom: 30px;
}
.alumni{
    background-image: url(../images/alubg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 500px;
}
.alumni .moretitle{
    text-align: center;
    color: #fff;
    padding-top: 120px;
}
.alumni .moretitle p{
    font-size: 18px;
    padding-bottom: 10px;
}
.alumni .moretitle .tip{
    font-size: 50px;
    padding-bottom: 40px;
}
.person_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.person_list li{
    float: left;
    padding: 0 15px;
    width: 20%;
    margin-bottom: 50px;
    margin-top: 30px;
    /*height: 385px;*/
    /*border:1px solid #ccc;*/
    transition: all 0.5s;
}
.person_list li:hover .view-hover{
    transform: translate(0px,-3px);
}
.person_list .view-hover{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    transition: all 0.5s;
}
.person_list .personitem{
    background-color: #d8e2f0;
    text-align: center;
    position: relative;
    padding: 40px 0px 10px 0px;
}
.person_list .title{
    padding: 5px;
    line-height: 24px;
    text-align: center;
    background: #5b9cd6;
    color: #fff;
    /*height: 160px;*/
}
.person_list .personmess{
    background: #fff;
    text-align: left;
    color: #666;
    line-height: 30px;
    padding: 20px 10px 20px 10px;
    height: 160px;
}
.person_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.person_list .view-hover img{
    position: relative;
    top: 40px;
    z-index: 99;
    left: 57px;
}

/*Aboutshu.hmtl*/
.towards{
    position: relative;
    background-image: url(../images/towardsbg.png), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    /*height: 600px;*/
    /*margin: 80px 0px 0px 0px;*/
}
.towards .moretitle{
    text-align: center;
    color: #dde0e7;
    padding-top: 100px;
    height: 560px;
}
.towards .moretitle .historylist{
    overflow: hidden;
    padding: 0 90px;
}
.towards .moretitle .historylist .item{
    position: relative;
    float: left;
    z-index: 2;
    width: 250px;
    height: 400px;
    cursor: pointer;
}
.towards .moretitle .historylist .item:hover .hover{
    opacity: 1;
    cursor: pointer;
}
.towards .moretitle .historylist .item .hover{
    position: absolute;
    opacity: 0;
    top: 75px;
    width: 100px;
    left: 45px;
    width: 177px;
    z-index: 99;
    transition: all 0.5s;
}
.towards .moretitle h1{
    font-size: 40px;
    color: #fff;
    padding: 20px 0px;
}
.towards .moretitle img{
    position: relative;
    z-index: 2;
    width: 230px;
}
.towards .moretitle p{
    text-align: center;
    line-height: 30px;
    width: 900px;
    color: #333;
    position: absolute;
    bottom: 90px;
    left: 150px;
}
.factsmodal{

}
.pd50{
    padding: 50px 0px;
}
.lefttable{
    width: 455px;
    float: left;
}
.righttable{
    float: right;
    width: 725px;
}
.highlevelmodal{
    position: relative;
    background-image: url(../images/highlevelbg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 655px;
    overflow: hidden;
}
.highlevelmodal .highlevelmess .highlist{
    position: relative;
    top: -20px;
}   
.highlevelmodal .highlevelmess .inter_list{
    width: 425px;
    float: left;
    text-align: left; 
    padding: 0px 53px;
}
.highlevelmodal .highlevelmess .inter_list li{
    line-height: 30px;
}
.highlevelmodal .highlevelmess .inter_list li a{
    color: #333;
}
.highlevelmodal .highlevelmess .inter_list span{
    background-color: #2c6fad;
    color: #fff;
    display: block;
    width: 300px;
    line-height: 40px;
    text-align: center;
}
.highlevelmodal .highlevelmess .map{
    position: relative;
    top: -100px;
    float: left;
}
.highlevelmodal .highlevelmess .map a{
    position: absolute;
    top: 160px;
    right: 98px;
    border-bottom: 1px solid #08c;
    font-size: 14px;
}
.divisionmodal .divisiondata{
    margin-top: 100px;
}
.divisionmodal .title{
    text-align: center;
}
.divisionmodal .techimg{

}
.teachmodal .maskdown{
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    height: 150px;
    opacity: 0.6;
    transition: 0.5s;
}
.teachmodal .teachmess{
    overflow: hidden;
    width: 537px;
}
.teachmodal .view-hover img{
    height: 485px;
    width: 440px;
}
.teachmodal .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 256px 30px 228px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    height: 150px;
    opacity: 0.6;
    transition: 0.5s;
}
.pdr15{
    padding-right: 10px;
}
.pdl34{
    padding-left: 34px;
}
.pdl65{
    padding-left: 65px;
}
.teachmodal .maskdown .tip{
    text-align: left;
}
.teachmodal .maskdown span{
    border-bottom: 1px solid #fff;
}
.teachmodal .areachange{
    position: relative;
    background-image: url(../images/techbtn.png), none;
    background-size: cover;
    background-repeat: no-repeat;
    width: 222px;
    height: 485px;
}
.teachmodal .areachange .item{
    position: relative;
    text-align: center;
    padding: 37px 0px;
}
/*.teachmodal .areachange .active .leftbtn{
    transition: 0.5s;
}*/
.teachmodal .areachange .active .leftbtn1{
    left: 55px!important;
}
.teachmodal .areachange .active .leftbtn2{
    left: 35px!important;
}
.teachmodal .areachange .active .leftbtn3{
    left: 20px!important;
}
.teachmodal .areachange .changeimg img{
    border: 0px solid #1f61af;
    transition: 0.5s;
}
.teachmodal .areachange .active .changeimg img{
    border: 5px solid #1f61af;
}
.teachmodal .areachange .item .leftbtn1{
    position: absolute;
    top: 62px;
    left: 128px;
    transition: 0.5s;
}
.teachmodal .areachange .item .leftbtn2{
    position: absolute;
    top: 62px;
    left: 112px;
    transition: 0.5s;
}
.teachmodal .areachange .item .leftbtn3{
    position: absolute;
    top: 64px;
    left: 92px;
    transition: 0.5s;
}
.divisionmodal .teachmess ul li{
    padding: 0px 20px 20px 20px;
    border-bottom: 1px solid #ccc;
}
.divisionmodal .teachmess ul li:last-child{
    border:0;
}
.divisionmodal .teachmess ul li .p1{
    font-size: 20px;
    line-height: 40px;
}
.divisionmodal .teachmess ul li .active{
    color: #589edb!important;
}
.divisionmodal .teachmess ul li .p2{
    font-size: 12px;
    padding-bottom: 10px;
    color: #ff9226;
}
.divisionmodal .teachmess ul li a{
    padding-top: 10px;
    border-bottom: 1px solid #ccc;
    width: 100px;
    display: block;
}
.shanghaicity{
    position: relative;
    background-image: url(../images/mzbg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 655px;
    overflow: hidden;
}
.shanghaicity .citymess .leftmess{
    /*width: 600px;*/
    position: relative;
}
.shanghaicity .citymess .leftmess .p1{
    padding: 60px 30px 30px 0px;
}
.shanghaicity .citymess .leftmess .p2{
    font-size: 30px;
    padding: 10px 10px 10px 0px;
}
.shanghaicity .citymess .leftmess .p3{
    padding: 30px 30px 20px 0px;
    border-bottom: 1px solid #ccc;
}
.shanghaicity .citymess .p4{
    line-height: 28px;
}
.shanghaicity .citymess .moreinfo{
    position: absolute;
    top: 65px;
    background-color: #2c6fad;
    border-radius: 45px;
    font-size: 14px;
    transition: 0.5s;
    right: 0px;
}
.shanghaicity .citymess .moreinfo a{
    padding: 20px 98px;
    color: #fff!important;
    display: inline-block;
}
.cfad{
    color: #2c6fad;
}
.cff9{
    color: #ff9226;
}

/*scholarship*/
.scholarshipmenu{
    padding-top: 105px;
    padding-bottom: 23px;
}
.scholarshipmenu i{
    color: #5dbcff;
    font-size: 26px;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
}
.attachment{

}
.attachment .downlist{
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.attachment .downlist ul li{
    float: left;
    width: 33.33%;
    margin-bottom: 35px;
}
.attachment .downlist ul li .item {    
    position: relative;
    margin: 0 15px;
    border: 1px solid #4f96d6;
    border-radius: 45px;
    height: 50px;
    border-left: 0px;
}
.attachment .downlist ul li .item .download{
    width: 70px;
    border-radius: 45px 0px 0px 45px;
    background: #4f96d6;
    text-align: center;
    height: 48px;
    padding-top: 10px;
    padding-left: 5px;
    position: absolute;
}
.attachment .downlist ul li .item .download i{
    color: #fff;
    font-size: 26px;
}
.attachment .downlist ul li .item a{
    padding-left: 10px;
    color: #4f96d6;
    height: 50px;
    /* line-height: 21px; */
    display: inline-block;
    padding: 4px 1px 5px 95px;
    font-size: 12px;
}
.h700{
    height: 700px!important;
}
.staffmodal{
    margin-bottom: 50px;
}
.staffmodal .staffleft{
    position: relative;
    float: left;
    background: #dce0e6;
    width: 385px;
    padding: 30px 20px 20px 20px;
    height: 645px;
    border-left: 5px solid #c5cdd9;
}
.staffmodal .staffleft .p1{
    line-height: 28px;
    color: #666;
}
.staffmodal .staffleft .p2{
    line-height: 28px;
    color: #666;
}
.staffmodal .staffleft h1{
    padding: 40px 0px;
    font-size: 28px;
}
.staffmodal .staffleft .admissionBtn{
    position: absolute;
    bottom: 0px;
    left: 55px;
}
.staffmodal .staffright{
    width: 775px;
    height: 645px;
    float: right;
}
.staffmodal .staffright .btip{
    position: absolute;
    bottom: -20px;
    color: #ff8863;
}
.staffmodal .staffleft .admissionBtn:hover a{
    font-size: 14px;
}
.guide{
    overflow: hidden;
}
.guide .maskdown{
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.guide .view-hover img{
    width: 775px;
    height: 420px;
}
.guide .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 260px 30px 228px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.guide .maskdown .tip{
    text-align: left;
}
.staffmodal .staffright .bachelor{
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.staffmodal .staffright .bachelor li{
    float: left;
    padding: 0px 15px;
    width: 33.33%;
    /* margin-bottom: 35px; */
    border-left: 1px solid #ccc;
    margin: 30px 0px;
}
.staffmodal .staffright .bachelor li:first-child{
    border:0px;
}
.staffmodal .staffright .bachelor .tip{
    font-size: 40px;
    color: #999999;
    padding: 0px 0px 30px 0px;
}
.announcements{

}
.announcements .file_icon{
    padding: 0 10px;
}
/*@-webkit-keyframes rightan {
from
{
    bottom: 0%;
    opacity: 0;
}
to
{
    bottom: 5%;
    opacity: 1;
}
.rightan
{

-webkit-animation: rightan 1s infinite;
-webkit-animation-fill-mode: both;
}

*/
.top_campusbar{
    margin: 80px 0px 0px 0px;
    background-image: url(../images/campusbg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 400px;
}
.top_campusbar .moretitle {
    text-align: center;
    color: #fff;
    padding-top: 60px;
}
.top_campusbar .moretitle p {
    font-size: 16px;
    padding-bottom: 5px;
}
.top_campusbar .moretitle a {
    display: inline-block;
    padding: 8px 40px;
    border-radius: 20px;
    border: 1px solid #ccc;
    color: #fff;
    margin-top: 30px;
}
.locationmodal{
    padding-top: 50px;
    padding-bottom: 50px;
}
.list_btn{
    width:100%;
    height: 55px;
    /*border-bottom:solid 2px #0081C2;*/
    margin: 0px 0px 40px 0px;
}
.list_btn ul{
    position: relative;
    width: 100%;
    height: 55px;
    bottom: 0px;
}
.list_btn ul li{
    width: 298px;
    height: 55px;
    float: left;
    /*margin-right: 2px;*/
    margin-bottom: 0px;
    border-right: 2px solid transparent;
}
.list_btn ul li a{
    display: block;
    height: 50px;
    font-size: 14px;
    text-align: center;
    line-height: 50px;
    border-radius: 10px 10px 0px 0px;
    background-color: #dae2e8;
    margin-top: 5px;
    color: #666;
    border-bottom: 7px solid #5b9cd6;
}
.list_btn ul li a:hover{
    height: 55px;
    background-color: #5b9cd6;
    color: #fff;
    line-height: 55px;
    margin-top: 0px;
}
.list_btn ul li .active{
    height: 55px;
    background-color: #5b9cd6;
    color: #fff;
    line-height: 55px;
    margin-top: 0px; 
}
.list_detial_content{
    width: 1200px;
    height: 1200px;
    position: relative;
    margin-bottom: 60px;
}
.list_detial{width: 1200px;
    height: auto;
    overflow: hidden;
    position: absolute;
    display: none;
}
.list_detial:first-child{
    display: block;
}
.list_detial .list_title{
    width: 100%;
    height: auto;
    font-size: 16px;
    margin: 20px 0px 60px 0px;
    align-content: center;
    text-align: center;
}
.list_detial .list_detial_in{

}
.list_detial .list_detial_in .item{
    padding: 20px;
}
.detial_must_li{
    width:390px ;
    height: 560px;
    position: relative;
    margin-bottom:15px;
    background: #FFFFFF;
    margin-right: 15px;
    float: left;
}
.detial_must_li:nth-child(3n){
    margin-right: 0px;
}
.detial_img img{
    width: 390px; 
    height: 230px;
}
.detial_title{
    height: 50px;
    font-weight: bold;
    font-size: 18px;
    line-height: 50px;
}
.detial_neirong{
    line-height: 25px;
    font-size: 14px;
}
.detial_link{
    position: absolute;
    font-size: 16px;
    bottom: 0px;
    right: 40px;
    bottom: 20px;
    color: #ffb378;
}
/*UTSEUS.html*/
.utseustitle{
    background-image: url(../images/shljzbg.jpg), none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 590px;
    margin-top: 80px;
}
.utseustitle .moretitle{
    text-align: center;
    color: #fff;
    padding-top: 120px;
}
.utseustitle .moretitle p{
    font-size: 16px;
    padding-bottom: 10px;
}
.utseustitle .moretitle .tip{
    font-size: 40px;
    padding-bottom: 40px;
}
.utcmess{
    text-align: center;
    padding: 40px 0px;
}
.utcmess .ensure{
    margin: 0 auto;
}
.utseusmess{
    background-color: #f2f2f2;
}
.utseusmess .item{
    padding: 60px 0px;
}
.utseusmess .item .tip{
    color: #333;
    font-size: 18px;
}
.programdetails{
    text-align: center;
    padding-bottom: 60px;
}
.faqsmodal .sports_list {
    position: relative;
    margin: 0;
    margin: 0 -10px;
    overflow: hidden;
    list-style: none;
}
.faqsmodal .sports_list li{
    float: left;
    padding: 0 10px;
    width: 25%;
    margin-bottom: 10px;
    margin-top: 10px;
}
.faqsmodal .sports_list li img{
    width: 292px;
    height: 210px;
    transition: transform 0.5s;
}
.faqsmodal .sports_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.faqsmodal .sports_list .view-hover:hover img {
    transform: scale(1.2);
}
.faqsmodal .sports_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 47px 30px 163px 31px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.faqsmodal .sports_list .maskdown {
    position: absolute;
    width: 100%;
    padding: 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    height: 30px;
    opacity: 0.6;
    transition: 0.5s;
    line-height: 30px;
    font-size: 12px;
}
.faqsmodal .sports_list .maskdown .tip{
    font-size: 22px;
}
.faqsmodal .sports_list .maskdown span{
    border-bottom: 1px solid #fff;
}
.international .p1{
    overflow: hidden;
    padding: 40px 0px;
}
.international .p2{
    overflow: hidden;
    padding: 40px 0px;
}
.international .mess1{
    width: 520px;
    line-height: 35px;
    padding: 20px 0px;
    font-size: 16px;
}
.international .mess2{
    width: 500px;
    line-height: 29px;
    font-size: 16px;
}
.societies_li{
    width:390px ;
    height: 620px;
    position: relative;
    margin-bottom:15px;
    background: #FFFFFF;
    margin-right: 15px;
    font-size: 14px!important;
    float: left;
}
.societies_li:nth-child(3n){
    margin-right: 0px;
}
.societies_neirong{
    line-height: 25px; 
    font-size: 14px; 
}
.societies_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.societies_list li{
    float: left;
    padding: 0 15px;
    width: 33.33%;
    margin-bottom: 80px;
    margin-top: 30px;
}
.societies_list li img{
    width: 385px;
    height: 385px;
    transition: transform 0.5s;
}
.societies_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.societies_list .view-hover:hover img {
    transform: scale(1.2);
}
.societies_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 192px 30px 162px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.societies_list .maskdown {
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 0px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.societies_list .maskdown .tip{
    font-size: 22px;
}
.societies_list .maskdown span{
    border-bottom: 1px solid #fff;
}

.house_list {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.house_list li{
    float: left;
    padding: 0 15px;
    width: 33.33%;
    margin-bottom: 80px;
    margin-top: 30px;
}
.house_list li img{
    width: 385px;
    height: 385px;
    transition: transform 0.5s;
}
.house_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.house_list .view-hover:hover img {
    transform: scale(1.2);
}
.house_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 190px 30px 162px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.house_list .maskdown {
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 2px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.house_list .maskdown .tip{
    font-size: 16px;
}
.house_list .maskdown span{
    border-bottom: 1px solid #fff;
}

.house_list50 {
    position: relative;
    margin: 0;
    margin: 0 -15px;
    overflow: hidden;
    list-style: none;
}
.house_list50 li{
    float: left;
    padding: 0 15px;
    width: 50%;
    margin-bottom: 80px;
    margin-top: 30px;
}
.house_list50 li img{
    width: 590px;
    height: 360px;
    transition: transform 0.5s;
}
.house_list50 .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.house_list50 .view-hover:hover img {
    transform: scale(1.2);
}
.house_list50 .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 190px 30px 162px 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.house_list50 .maskdown {
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #000;
    color: #fff;
    text-align: center;
    bottom: 2px;
    left: 0;
    opacity: 0.6;
    transition: 0.5s;
}
.house_list50 .maskdown .tip{
    font-size: 16px;
}
.house_list50 .maskdown span{
    border-bottom: 1px solid #fff;
}
.houselist ul{
    position: relative;
    margin: 0;
    overflow: hidden;
    list-style: none;
}
.houselist ul li {
    float: left;
    text-align: center;
    padding: 0 15px;
    width: 33.33%;
}
.houselist ul li img{
    padding-bottom: 30px;
}
.houselist ul li a {
    display: inline-block;
    padding: 10px 50px;
    background-color: #1b467b;
    border-radius: 5px;
}
.houselist ul li p{
    text-align: left;
}
.wordmap{
}
.cover{ 
    position: fixed;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    filter: alpha(opacity=60);
    opacity: 0.6;
    display: none;
    z-index: 9999;
}
.modal{ 
    position: absolute;
    width: 720px;
    top: 20%;
    left: 50%;
    background-color: #fff;
    display: none;
    cursor: pointer;
    z-index: 9999;
    margin-left: -360px;
}
.modal span {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 9999999;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 25px;
}
.modal .area1{
    position: absolute;
    top: 128px;
    width: 100px;
    height: 200px;
    left: 30px;
    line-height: 12px;
    font-size: 12px;
}
.modal .area1 a{
    color: #385723;
}
.modal .area2 a{
    color: #385723;
}
.modal .area2{
    position: absolute;
    top: 128px;
    width: 100px;
    height: 200px;
    left: 80px;
    text-align: right;
    line-height: 12px;
    font-size: 12px;
}
.modal .area3{
    position: absolute;
    top: 155px;
    width: 100px;
    left: 260px;
    line-height: 12px;
    font-size: 12px;
}
.modal .area3 a{
    color: #699a8c
}
.modal .area4{
    position: absolute;
    top: 190px;
    width: 100px;
    left:460px;
    line-height: 12px;
    font-size: 12px;
}
.modal .area4 a{
    color: #7f6000
}
.modal .area5{
    position: absolute;
    top: 290px;
    width: 100px;
    height: 200px;
    left: 80px;
    text-align: right;
    line-height: 12px;
    font-size: 12px;
}
.modal .area5 a{
    color: #843c0c
}
.modal .area6{
    position: absolute;
    top: 260px;
    width: 100px;
    left: 125px;
    text-align: right;
    line-height: 12px;
    font-size: 12px;
}
.modal .area6 a{
    color: #b74e4d
}
.modal .area7{
    position: absolute;
    top: 240px;
    width: 100px;
    left: 240px;
    text-align: left;
    line-height: 12px;
    font-size: 12px;
}
.modal .area7 a{
    color: #203864
}
.modal .area8{
    position: absolute;
    top: 340px;
    width: 100px;
    left: 285px;
    text-align: left;
    line-height: 12px;
    font-size: 12px;
}
.modal .area8 a{
    color: #441c8c
}
.modal .area9{
    position: absolute;
    top: 315px;
    width: 100px;
    right: 65px;
    text-align: left;
    line-height: 12px;
    font-size: 12px;
}
.modal .area9 a{
    color: #843c0c
}
.modal a{
    display: block;
}

/*faqs*/
.guide{
    /*height: 500px;*/
    margin-top: 50px;
    padding: 10px;
}
.faqstab{
    width: 300px;
}
.faqstab ul li{
    /*padding: 10px;*/
    background: #e9ecf3;
    color: #333;
    margin-bottom: 10px;
    cursor: pointer;
}
.faqstab ul li:hover{
    /*padding: 10px;*/
    background: #e9ecf3;
    color: #333;
    margin-bottom: 10px;
    cursor: pointer;
    border-right: 5px solid #8a99be;
    background: #cfd6e7;
}
.faqstab ul li a{
    display: block;
    padding: 10px;
    color: #333;
}
.faqstab .title{
    background: #4f96d6;
    color: #fff;
    cursor: default;
    padding: 10px;
    margin-bottom: 10px;
}
.faqstab .act{
    border-right: 5px solid #8a99be;
    background: #cfd6e7;
}
.faqsmod {
    width: 850px;
}
.faqsmod .rigthmodal{
    margin-top: 30px;
}
.faqsmod .rigthmodal .item{
    overflow: hidden;
    margin-top: 30px;
}
.faqsmod .rigthmodal .mess{
    width: 520px;
    padding: 30px;
    line-height: 38px;
}
.faqsmod .title{
    height: 90px;
    line-height: 90px;
    font-size: 24px;
    color: #1b467b;
    border-bottom: 1px dashed #ccc;
}
.c4f96d6{
    color: #4f96d6
}

.engineering_list {
    position: relative;
    margin: 0;
    /*margin: 0 -15px;*/
    overflow: hidden;
    list-style: none;
}
.engineering_list li{
    float: left;
    /*padding: 0 15px;*/
    width: 33.33%;
    /*margin-bottom: 80px;*/
    /*margin-top: 80px;*/
}
.engineering_list li img{
    width: 400px;
    height: 400px;
    transition: transform 0.5s;
}
.engineering_list .view-hover{
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.engineering_list .view-hover:hover img {
    transform: scale(1.2);
    opacity: 0.5;
}
.engineering_list .view-hover:hover .maskdown{
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #2185b4;
    color: #fff;
    text-align: center;
    height: 100%;
    bottom: 0px;
    left: 0;
    opacity: 0.8;
    transition: 0.5s;
}
.engineering_list .maskdown h2{
    position: relative;
    padding: 0 40px;
    margin-bottom: 40px;
    font-size: 26px;
}
.engineering_list .maskdown h2 span{
    width: 25px;
    height: 4px;
    background: #fff;
    display: inline-block;
    position: absolute;
    bottom: -14px;
    left: 155px;
}
.engineering_list .maskdown {
    position: absolute;
    width: 100%;
    padding: 30px;
    background-color: #2185b4;
    color: #fff;
    text-align: center;
    height: 100%;
    bottom: 0px;
    left: 0;
    opacity: 0;
    transition: 0.5s;
}
.engineering_list .maskdown .tip{
    font-size: 22px;
}

.engineering_list .maskdown p{
    font-size: 12px;
}
.engineertitle{
    text-align: center;
    padding: 30px 0;
}